<template>

  <scroll-view enhanced show-scrollbar="{{false}}" scroll-y>
   <view class="notify-meta">
     <view class="title">{{noticeDetail.title}}</view>
     <view class="extra">
       <view class="author">{{noticeDetail.creatorName}}</view>
       <view class="datetime">{{noticeDetail.createdAt}}</view>
     </view>
   </view>
   <view class="notify-content">
     <rich-text :nodes="noticeDetail.content"></rich-text>
   
   </view>
 </scroll-view>
 </template>
 <script setup> 
 import { getAnnouncementIdAPI } from "@/api/index";
 import { onLoad } from '@dcloudio/uni-app';
import { ref } from "vue";

 const noticeDetail = ref({})

let id =''
 onLoad((e) => {
    console.log(e.id,222222);
    id = e.id
    getAnnouncementId11()
 })

 const getAnnouncementId11 = async () => {
    const { data } = await getAnnouncementIdAPI(id)
    console.log(data);
    noticeDetail.value=data
 }
 



  
 </script>
 <style scoped lang="scss">
 page {
   height: 100vh;
   overflow: hidden;
   background-color: #fff;
 }
 
 .notify-meta {
   padding: 30rpx 40rpx;
   position: relative;
 
   &:after {
     content: ' ';
     position: absolute;
     left: 0;
     bottom: 0;
     right: 0;
 
     border-bottom: 1px solid #ebedf0;
     box-sizing: border-box;
     pointer-events: none;
 
     transform: scaleY(0.5);
     transform-origin: center;
     border-bottom-width: 1px;
     border-bottom-style: solid;
     border-bottom-color: rgb(235, 237, 240);
   }
 
   .title {
     font-size: 34rpx;
     font-weight: 500;
     margin-bottom: 10rpx;
   }
 
   .extra {
     display: flex;
     justify-content: space-between;
     color: #bdbdbd;
     font-size: 24rpx;
   }
 }
 
 .notify-content {
   line-height: 1.8;
   padding: 30rpx 40rpx calc(env(safe-area-inset-bottom) + 30rpx);
   font-size: 28rpx;
   color: #686868;
 }
 
 </style>